<template>
	<view class="address-list">
		<u-navbar
			title="收货地址"
			:autoBack="true"
			placeholder
		>
		</u-navbar>
		
		<view class="address-item" v-for="(item,index) in address" :key="index" @click="chooseAddress(item.aid)">
			<view class="item__name__phone">
				<text class="item__name">{{item.name}}</text>
				<text class="item__phone">{{item.phone}}</text>
				<view class="item__default" v-if="item.default">默认</view>
			</view>
			<view class="item__address">{{item.address}}</view>
			<view class="item__bottom">
				<view class="item__bottom__delete" @click="deleteClick(index)">
					<u-icon name="trash" size="18"></u-icon>
					<text>删除</text>
				</view>
				<view class="item__bottom__edit" @click="editClick(index)">
					<u-icon name="edit-pen" size="18"></u-icon>
					<text>编辑</text>
				</view>
			</view>
		</view>
		
		<u-popup :show="deleteShow" mode="center" round="10" :safeAreaInsetBottom="false" closeOnClickOverlay
			@close="cancelDelete"
		>
			<view class="delete-pop__wrap">
				<view class="delete__tips">确认将这个地址删除?</view>
				<view class="delete__todo">
					<view class="delete__todo__think" @click="cancelDelete">我再想想</view>
					<view class="delete__todo__delete" @click="handleDelete">删除</view>
				</view>
			</view>
		</u-popup>
		<u-toast ref="uToastRef"></u-toast>
		<view class="add-button">
			<u-button text="新增收货地址" icon="plus" iconColor="#fff" shape="circle" color="#f56c6c" 
				@click="addAddress"
		></u-button>
		</view>
	</view>
</template>

<script lang="ts" setup>
	import {ref,getCurrentInstance,onMounted} from 'vue'
	import type { IAddress } from "@/types/address"
	import {onLoad} from "@dcloudio/uni-app";	
	
	const { proxy }: any = getCurrentInstance()
	const address = ref<IAddress[]>([])
	const deleteShow = ref(false)
	const deleteIndex = ref(0)
	const uToastRef = ref()
	const choose = ref(false)
	
	const addAddress = () => {
		uni.redirectTo({
			url: '/user/add_address/add_address'
		})
	}
	
	const editClick = (index: number) => {
		const addressItem = address.value[index]
		uni.redirectTo({
			url: '/user/edit_address/edit_address?aid='+addressItem.aid
		})
	}
	
	const deleteClick = (index: number) => {
		deleteShow.value = true
		deleteIndex.value = index
	}
	
	const cancelDelete = () => {
		deleteShow.value = false
	}
	
	const handleDelete = () => {
		const addressItem = address.value[deleteIndex.value]
		const storageInfo = uni.getStorageSync("info")
		const data = {
			userId: storageInfo.id,
			aid: addressItem.aid
		}
		proxy.ajax(proxy.api.deleteAddress, "POST", data, function(resp: any){
			address.value = resp.data.address
			deleteShow.value = false
			uToastRef.value.show({
				type: 'success',
				message: "删除成功",
			})
		})
	}
	
	const chooseAddress = (aid: string) => {
		if(choose.value){
			uni.redirectTo({
				url: "/order/create_order/create_order?aid=" + aid
			})
		}
	}
	
	onMounted(()=>{
		let storageInfo = uni.getStorageSync("info")
		proxy.ajax(proxy.api.getAddress, "POST", {userId: storageInfo.id}, function(resp: any){
			address.value = resp.data.address
		})
	})
	
	onLoad((options)=>{
		choose.value = JSON.stringify(options) === '{}' ? false : true
	})
	
</script>

<style lang="scss">
@import "style.scss"
</style>
